/**
 *
 */
var yueStore4r_s1 = Ext.create('Ext.data.Store', {
	storeId: 'yueSample4r_s1',
	fields:[ 'index1', 'index2', 'index3', 'index4', 'index5', 'index6', 'index7', 'index8', 'index9', 'index10',
		'index11', 'index12', 'index13', 'index14', 'index15', 'index16', 'index17', 'index18', 'index19', 'index20'],
	data: [	{index1: '1月'},
			{index1: '2月'},
			{index1: '3月'},
			{index1: '4月'},
			{index1: '5月'},
			{index1: '6月'},
			{index1: '7月'},
			{index1: '8月'},
			{index1: '9月'},
			{index1: '10月'},
			{index1: '11月'},
			{index1: '12月'}],
	listeners: {
		datachanged: {
			fn: function(obj, eOpt){
				var size = yueStore4_1.getCount();
				if(yueChartReserviorSingle1 != null){
					var series = yueChartReserviorSingle1.series;
					series[0].setData(getDataArray(obj, 'index2', 0, size));
					series[1].setData(getDataArray(obj, 'index3', 0, size));
				//	series[2].setData(getDataArray(obj, 'index4', 0, size));
				//	series[3].setData(getDataArray(obj, 'index5', 0, size));
				//	series[4].setData(getDataArray(obj, 'index6', 0, size));
				}
				if(yueChartReserviorSingle2 != null){
					var series = yueChartReserviorSingle2.series;
					series[0].setData(getDataArray(obj, 'index4', 0, size));
				}
			}
		}
	}
});

var yueCurrentReserviorID = 1;
var yueReserviorSingleData;

var yueChartReserviorSingle1;
var yueChartReserviorSingle2;

function yueFillDataReserviorSingle(data){
	yueReserviorSingleData = data;
	yueChangeReserviorSingleView(yueCurrentReserviorID);
}

function yueChangeReserviorSingleView(id){
	yueCurrentReserviorID = id;
	if(yueReserviorSingleData != null){
		var data = eval("yueReserviorSingleData.index"+id)
	//	console.log(data);
		yueStore4r_s1.setData(data);
	}
}

function yueReserviorSingleChart(element, title){
	return Highcharts.chart(element, {
	    title: {
	        text: title
	    },
	    xAxis: {
	        categories: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月']
	    },
	    yAxis: [{
	        title: {
	            text: '流量m³/s'
	        }
	    }/*,{
	    	title: {
	            text: '水位m'
	        },
	        opposite: true
	    }*/],
	    tooltip: {
            shared: true,
            crosshairs: true,
            valueDecimals: 3
        },
	    series: [{
	        name: '入库',
	        data: getDataArray(yueStore4r_s1, 'index2', 0, yueStore4_1.getCount())
	    }, {
	        name: '出库',
	        data: getDataArray(yueStore4r_s1, 'index3', 0, yueStore4_1.getCount())
	    }/*, {
	        name: '水位',
	        yAxis: 1,
	        data: getDataArray(yueStore4r_s1, 'index4', 0, yueStore4_1.getCount())
	    }
	    , {
	        name: '水位上限',
	        yAxis: 1,
	        data: getDataArray(yueStore4r_s1, 'index5', 0, yueStore4_1.getCount())
	    }, {
	        name: '水位下限',
	        yAxis: 1,
	        data: getDataArray(yueStore4r_s1, 'index6', 0, yueStore4_1.getCount())
	    }*/]

	});
}

function yueReserviorSingleChart2(element, title){
	return Highcharts.chart(element, {
	    title: {
	        text: title
	    },
	    xAxis: {
	        categories: getDataArray(yueStore4r_s1, 'index1', 0, yueStore4_1.getCount())
	    },
	    yAxis: {
	        title: {
	            text: '水位m'
	        }
	    },
	    legend: {
	    	enabled: false
	    },
	    series: [{
	    	type: 'column',
	    	name: '水位',
	        data: getDataArray(yueStore4r_s1, 'index4', 0, yueStore4_1.getCount())
	    }]
	});
}


Ext.define('Admin.view.needwater.subpage.reserviorSingle',{
	extend:'Ext.panel.Panel',
	xtype:'yueReserviorSingle',
	//起别名
	alias:'yueReserviorSingle',
	require:[],
	user:[],
	userCLs:'big-100 small-100',
	layout: {
        type: 'hbox',
        align: 'stretch'
    },
	items:[{
		xtype: 'panel',
		flex: 1,
		layout: {
	        type: 'vbox',
	        align: 'stretch'
	    },
		items: [{
			html: '<div id="yueChart4-reserviorSingle-1" style="width:100%; height:100%;"></div>',
			listeners: {
				resize: {
					fn: function(){
						yueChartReserviorSingle1.reflow();
					}
				},
				boxready: {
					fn: function(obj, width, height, eOpts){
						yueChartReserviorSingle1 = yueReserviorSingleChart('yueChart4-reserviorSingle-1', '流量过程图');
					}
				}
			},
			flex:1
		},{
			html: '<div id="yueChart4-reserviorSingle-2" style="width:100%; height:100%;"></div>',
			listeners: {
				resize: {
					fn: function(){
						yueChartReserviorSingle2.reflow();
					}
				},
				boxready: {
					fn: function(obj, width, height, eOpts){
						yueChartReserviorSingle2 = yueReserviorSingleChart2('yueChart4-reserviorSingle-2', '水位变化');
					}
				}
			},
			flex:1
		}]
	},{
		xtype: 'grid',
		border: true,
	    margin: '0 10 10 30',
	    store: Ext.data.StoreManager.lookup('yueSample4r_s1'),
	    columns: [
	    	{ text: '月份', dataIndex: 'index1', width: '15%', minWidth: 100, align: 'center' },
	        { text: '入库', dataIndex: 'index2', width: '16%', minWidth: 100, align: 'center', renderer:
							function customRound(value, record){
								if(value == null)return null;
								return Ext.util.Format.round(value, 3);
							}
					},
	        { text: '水位', dataIndex: 'index4', width: '16%', minWidth: 100, align: 'center', renderer:
							function customRound(value, record){
								if(value == null)return null;
								return Ext.util.Format.round(value, 3);
							}
					},
	        { text: '出流', dataIndex: 'index3', width: '16%', minWidth: 100, align: 'center', renderer:
							function customRound(value, record){
								if(value == null)return null;
								return Ext.util.Format.round(value, 3);
							}
					},
	        { text: '水位上限', dataIndex: 'index5', width: '17%', minWidth: 100, align: 'center', renderer:
							function customRound(value, record){
								if(value == null)return null;
								return Ext.util.Format.round(value, 3);
							}
					},
	        { text: '水位下限', dataIndex: 'index6', width: '17%', minWidth: 100, align: 'center', renderer:
							function customRound(value, record){
								if(value == null)return null;
								return Ext.util.Format.round(value, 3);
							}
					},
	    ],
	    flex: 1
	}]
});
